// 编辑的事件
// 事件委托，添加点击事件
$('#tbd').on("click", ".btn-edit, .btn-del, .btn-ok, .btn-cancel", function () {
	
	const $tr = $(this).parents('tr');
	
	if($(this).hasClass('btn-edit')){
		$tr.addClass('edit').find('span').each( function() {
		// 把span的值赋给对应的input
			$(this).next().val($(this).html());
		})
		
	}else if($(this).hasClass('btn-ok')){
		
		// 先向数据库发送请求，成功后再进行赋值
		const id = $tr.data('id');
		const name = $tr.find('.inputName').val();
		const price = $tr.find('.inputPrice').val();
		const num = $tr.find('.inputNum').val();
		
		$.get("./api/info/update.php", { id,name,price,num }, (resp) => {
			
			// 当请求发送成功，就把input 的值赋给对应的span
			if(resp.code === 200){
				$tr.removeClass('edit').find('span').each(function(){
					$(this).html($(this).next().val())
				})	
			}
		}, 'json');
	}else if($(this).hasClass('btn-cancel')){
		// 只将tr的移除编辑的class
		$tr.removeClass('edit');
	}else if($(this).hasClass('btn-del')){
		// 根据本条数据的id删除数据库中的数据，并重新渲染数据
		const id = $tr.data('id');
		$.ajax({
			method: "get",
			url: "./api/info/del.php",
			data: { id },
			beforeSend: function(){
				return confirm("确定要删除本条数据吗?");
			},
			success: ( resp ) => {
				if(resp.code === 200){
					getPic();
				}
			},
			dataType: "json"
		})
	}
})










